第6节内置函数大纲

(一) 构造函数和创建对象
- 1.两种函数
- 2.创建对象的两种方式
(二) 日期对象常用方法和插件
(三) Math 对象
(四) 字符串常用方法
- (1) 基本类型添加属性无效
- (2) 字符串常用方法
(五) 常用的数组方法
(七) 练习和作业
(七) 数组作业

(一) 构造函数和创建对象

两种函数
创建对象的两种方式

1.两种函数

普通函数: 用来实现某个功能
构造函数: 用来创建对象

<script>
  // 实现两个数相加的功能
  function add(a,b){
    var sum = a+b;
    return sum;
  }

  // 用来创建猫对象的一个函数
  function Cat(name,age) {
    this.name = name;
    this.age = age;
  }
  var cat = new Cat('小白',2);
  var cat2 = new Cat('小花',3);
  console.log(cat,typeof cat);
  console.log(cat2,typeof cat2); 
</script>

2.创建对象的两种方式

<script>
  // 字面量方式创建对象
  var obj = {
    name: '张三',
    age: 20
  }
  var arr = [1,2,3];

  // 声明构造函数,使用new的方式创建对象
  function Cat(name,age) {
    this.name = name;
    this.age = age;
  }
  var cat = new Cat('小白',2);
  var cat2 = new Cat('小花',3);
  console.log(cat,typeof cat);
  console.log(cat2,typeof cat2);  
</script>

(二) 日期对象常用方法和插件

创建日期对象
日期常用方法
日期函数应用
日期函数库 moment.js

1. 创建日期的3种方式

<script>
  // 方式1: 无参数
  var date = new Date();
  console.log('date',date);

  // 方式2: 参数为日期数字字符串
  var date2 = new Date('2020-12-12 00:00:00');
  console.log('date2',date2);

  // 方式3: 参数为数字0, 表示1970-01-01:8:00:00
  var date3 = new Date(0);
  console.log('date3',date3);

  // 方式4: 参数为距离1970年的毫秒数, 1970-01-02
  var date4 = new Date(86400000); 
  console.log('date4',date4);
  // 2021-12-26
  var date5 = new Date(1640506912716);  
  console.log('date5',date5);
</script>

2. 日期常用方法

new Date()
getFullYear()
getMonth() + 1
getDate()
getHours()
getMinutes()
getSeconds()
getDay()
getTime()

Date.now()

var date = new Date();
var Y = date.getFullYear(); // 年
var M = date.getMonth(); // 月份
var D = date.getDate(); // 日
var h = date.getHours(); // 时
var m = date.getMinutes(); // 分
var s = date.getSeconds(); // 秒
var d = date.getDay(); // 星期
var time = date.getTime(); // 1970到现在的毫秒数
var time2 = Date.now(); // 同上
console.log('年',Y);
console.log('月',M+1);
console.log('日',D);
console.log('时',h);
console.log('分',m);
console.log('秒',s);
console.log('星期',d);
console.log('毫秒数',time);
console.log('毫秒数',time2);

3. 日期函数应用

格式化日期

/**
 * str可以是日期字符串,可以是毫秒数, 可以不传
 */
function formatDate(str) {
  var date;
  if (!str) {
    date = new Date();
  } else {
    date = new Date(str);
  } 
  var Y = date.getFullYear();
  var M = date.getMonth()+1;
  var D = date.getDate();
  var h = date.getHours();
  var m = date.getMinutes();
  var s = date.getSeconds();
  M = M<10?`0${M}`:M;
  D = D<10?`0${D}`:D;
  h = h<10?`0${h}`:h;
  m = m<10?`0${m}`:m;
  s = s<10?`0${s}`:s;
  return `${Y}年${M}月${D}日 ${h}:${m}:${s}`
}
var date1 = formatDate();  // 不传参数
console.log('date1',date1);
var date2 = formatDate('2020-11-11 11:11:11');  // 传日期字符串
console.log('date2',date2);

比较日期
年纪越小, 毫秒数越大

var oDate = new Date('2001-10-06');
var yDate = new Date('2001-11-17');
console.log(oDate-yDate); // -3628800000

4. 日期函数库

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <script src="http://cdn.staticfile.org/moment.js/2.24.0/moment.js"></script>
</head>
<body>
  <script>
    var date1 = moment('2001-11-17').format('YYYY-MM-DD HH:mm:ss'); 
    document.write('陈*元的生日是: '+date1);

    var date2 = moment().add(3, 'days').format('MM-DD');
    document.write('<br/>')
    document.write('三天后是: '+date2);
  </script>
</body>
</html>

// 练习:

封装一个函数, 把当下的时刻在页面上显示, 格式为 xxxx年xx月xx日 xx:xx:xx

(三) Math 对象

常用方法

Math.round(x) // 四舍五入
Math.abs(x) // 求 x 的绝对值
Math.floor(x) // 向下取整
Math.ceil(x) // 向上取整
Math.random() // 随机数
其它:正弦、余弦、平方根...

相关方法

toFixed(x) 保留x位小数
parseInt 把小数变整数

应用获取某个范围内的随机数

(四) 字符串常用方法

(1) 基本类型添加属性无效

// 对象可以添加属性
var obj = {
    name:'zs',
    age:18,
    say() {
        console.log('我叫zs');
    }
}
obj.addr = '广东深圳';
obj['hobby'] = 'codeing';
console.log('obj',obj);

// 数组(也是对象)可以添加属性
var arr = [1,2,3];
arr.name = '数组';
console.log('name',arr.name);

// 函数(也是对象)可以添加属性
function say() {
    console.log('say');
}
say.cname = '函数';
console.log('cname',say.cname);


// 基本数据类型不能添加属性
var num = 100;
num.aa = 5;
console.log('aa',num.aa);

(2) 字符串常用方法

length // 字符串的长度
trim() // 去掉字符串前后的空格
split() // 字符串转数组,接收一个参数,作为转换的标志
截取字符串
1. substring() // 截取字符串,接收两个参数,开始的位置和结束的位置
2. slice() // 截取字符串, 用法类似substring, 但可以复数
3. substr() // 截取字符串, 接收两个参数,第一个参数是开始位置, 第二个参数是截取的字符个数
检测字符串
1. charAt() // 下标对应的字符, 若没有返回空
2. indexOf() // 返回检测字符串的位置
3. lastIndexOf() // 同上,但从后面开始检查
4. includes() // 检查字符串是否包含指定字符
toLowerCase() // 转小写字母
toUpperCase() // 转大写字母
match() // 检查有没有包含某个值, 返回符合一个数组,存放符合条件的字符
replace() // 替换

// 长度,下标, 去空格, 转数组

// 1.字符串长度和下标
var str1 = 'abcdef'; 
console.log('str1长度:', str1.length);
console.log('第1个字符:',str1[0]);
console.log('最后1个字符:',str1[str1.length-1]);

// 2.去空格
var str2 = ' asdfasdfas ';
console.log('str2长度',str2.length);
var newStr2 = str2.trim();
console.log('新字符串的长度',newStr2.length);

// 3.转数组
var str3 = '张三,李四,王五';
var arr3 = str3.split(',');
console.log('arr3',arr3);
str3 = 'asdfjal;sjfasjkf;asjfl;asjkdfl;ak';
arr3 = str3.split('a');
console.log('arr3',arr3);

// 截取字符串

substring(不常用)
slice(常用)
substr 第二个参数为截取个数

var str = '13812345678';
var str1 = str.substring(2,5); // 812
console.log('str1',str1);

var str2 = str.slice(2,5);
console.log('str2',str2);
str2 = str.slice(2,-1);  // 从2开始, -1表示倒数第一个
console.log('str2负数',str2);
str2 = str.slice(2);
console.log('str2一个参数',str2);
str2 = str.slice(-4);
console.log('str2一个负数参数',str2);

var str3 = str.substr(2,5);
console.log('substr',str3);

// 检测字符串

// 1.charAt
var str = 'abcdefgabcdefg';
var str1 = str.charAt(2);
// var str1 = str.charAt(10);
console.log('str1',str1);

// 2.includes
var boo2 = str.includes('a'); // true
var boo2 = str.includes('x'); // false
console.log('boo2',boo2);

// 3. indexOf
var index3 = str.indexOf('b'); // 1
var index3 = str.indexOf('bb'); // -1
console.log('index3',index3);

// 4.lastIndexOf
var index4 = str.indexOf('f'); // 5
var index4 = str.lastIndexOf('f'); // 12
console.log('index4',index4);

// 小写和大写字母, match, replace

var str = 'myName,myAge';
var str1 = str.toLowerCase(); 
console.log('str1',str1);

var str2 = str.toUpperCase();
console.log('str2',str2);

// 3.match
var str3 = str.match('my'); // 匹配
var str3 = str.match('ny'); // null
console.log('str3',str3);

str3 = str.match(/Name/);
console.log('str3正则',str3);
str3 = str.match(/my/g);
console.log('str3正则',str3);

// 4.replace
var str4 =  str.replace('my','you');
console.log('str4',str4);
str4 = str.replace(/my/g,'you');
console.log('str4正则',str4);

(五) 常用的数组方法

【金山文档】《数组常用方法》

https://kdocs.cn/l/cdAwv1hETvhJ

join() 把数组的所有元素放入一个字符串。
reverse() 反转数组的元素顺序。
添加设删除数组成员
1. pop() 删除数组的最后一个元素并返回删除的元素。
2. push() 向数组的末尾添加一个或更多元素，并返回新的长度。
3. shift() 删除并返回数组的第一个元素。
4. unshift() 向数组的开头添加一个或更多元素，并返回新的长度。
数组检测
1. isArray() 判断对象是否为数组。
2. includes() 判断一个数组是否包含一个指定的值。 // 成员只能是基本数据类型
3. every();
4. some() 检测数组元素中是否有元素符合指定条件。 // 用来判断数组是否包含符合条件的成员, 包含返回 true, 不包含返回 false
5. find() 返回符合传入测试（函数）条件的数组元素。 // 只返回符合条件的第一个成员, 没有符合条件就返回 undefined
6. findIndex() 返回符合传入测试（函数）条件的数组元素索引。
7. indexOf() 搜索数组中的元素，并返回它所在的位置。
8. lastIndexOf() 搜索数组中的元素，并返回它最后出现的位置。
map()对原来成员改头换面
filter() 检测数值元素，并返回符合条件所有元素的数组。
forEach() 遍历数组。
slice() 选取数组的一部分，并返回一个新数组。
splice() 从数组中添加或删除元素。
sort() 对数组的元素进行排序。
reduce() 数组累加

1. join()

把数组的所有元素放入一个字符串

var arr = ['张三','李四','王五']; 
arr.join();  // 无参数
arr.join('-'); // 有参数

2. reverse()

反转数组的元素顺序(会改变原来的数组)

var arr = ['张三','李四','王五']; 
arr.reverse();
console.log(arr);

3. 添加设删除数组成员

注: 添加和删除都是在原来数组进行, 会改变原来的数组

pop() 删除数组的最后一个元素并返回删除的元素。
push() 向数组的末尾添加一个或更多元素，并返回新的长度。
shift() 删除并返回数组的第一个元素。
unshift() 向数组的开头添加一个或更多元素，并返回新的长度。

var arr = ['张三','李四','王五']; 
arr.push('陈六');
arr.push('林七','李八');
console.log(arr);
arr.unshift(1,2,3);
console.log(arr);
arr.pop(); // 从后面删除一个
console.log(arr); 
arr.shift(); // 从前面删除一个

4. 数组检测

Array.isArray() 判断对象是否为数组。
includes() 判断一个数组是否包含一个指定的值。 // 成员只能是基本数据类型
every() 数组成员每一个都符合条件返回true,否则返回false
some() 数组成员只要有一个都符合条件返回true,否则返回false
find() 返回符合传入测试（函数）条件的数组元素。 // 只返回符合条件的第一个成员, 没有符合条件就返回 undefined
findIndex() 返回符合传入测试（函数）条件的数组元素索引。
indexOf() 搜索数组中的元素，并返回它所在的位置。

lastIndexOf() 搜索数组中的元素，并返回它最后出现的位置。

// 1.Array.isArray()
var arr = [1,2,3];
var obj = {};
Array.isArray(arr); // 
Array.isArray(obj) // 

// 2.includes()
var arr = [1,2,3];
arr.includes(1); // true
arr.includes(4); // false

// 3.every
var arr = [18,20,30,50];
var result = arr.every(function(item,index,arr) {
  console.log(item,index,arr);
  return item > 10;
});
console.log(result);

// 4.some
var arr = [18,20,30,50];
var result = arr.some(function(item,index,arr) {
  console.log(item,index,arr);
  return item > 40;
});
console.log(result);
// 数组成员是对象
var arr = [
  {name:'张三',age:18},
  {name:'李四',age:28},
  {name:'王五',age:13},
  {name:'陈六',age:48},
];
var result = arr.some(function(item) { 
  return item.name === '张三';
});
console.log(result);

// 5.find,找到符合条件的成员, 只返回第一个
var arr = [
  {name:'张三',age:18},
  {name:'李四',age:28},
  {name:'王五',age:13},
  {name:'张三',age:48},
  {name:'陈六',age:48},
];
var result = arr.find(function(item) { 
  console.log(item);
  return item.name === '张三2';
});
console.log(result);

// 6.findIndex
var arr = [
  {name:'张三',age:18},
  {name:'李四',age:28},
  {name:'王五',age:13},
  {name:'张三',age:48},
  {name:'陈六',age:48},
];
var result = arr.findIndex(function(item) { 
  return item.name === '李四2';
});
console.log(result);

// 7.indexOf
var arr = ['a','b','c','d'];
// var result = arr.indexOf('c');
var result = arr.indexOf('f');
console.log(result);

// 8.lastIndexOf(略)

5. map()

对原来成员改头换面


var arr = [
  {name:'张三',age:18},
  {name:'李四',age:28},
  {name:'王五',age:13},
  {name:'张三',age:48},
  {name:'陈六',age:48},
];

var newArr = arr.map(function(item,index){
  return {
    name: item.name,
    age: item.age,
    addr: '广东',
    sex: index%2===0?'男':'女'
  } 
})
console.log(newArr);

6. filter()

检测数值元素，并返回符合条件所有元素的数组。

var arr = [
  {name:'张三',age:18},
  {name:'李四',age:28},
  {name:'王五',age:13},
  {name:'李三',age:48},
  {name:'陈六',age:48},
];

var list = arr.filter(function(item,index) {
  // 筛选条件
  return item.age > 20;
})
console.log(list);

// 找出名字带"三"的成员
var list2 = arr.filter(function(item) {
  return item.name.includes('三');
})
console.log(list2);

7. forEach()

遍历数组。

var arr = [
  {name:'张三',age:18},
  {name:'李四',age:28},
  {name:'王五',age:13},
  {name:'张三',age:48},
  {name:'陈六',age:48},
];

// for循环
var str = '';
for(var i=0;i<arr.length;i++) { 
  str += `<li>${arr[i].name} - ${arr[i].age}</li>`;
}
console.log(str);

// forEach
var str = '';
arr.forEach(function(item,index) { 
  str += `<li>${index}. ${item.name} - ${item.age}</li>`;
});
console.log(str);

8. slice()

选取数组的一部分，并返回一个新数组。

var arr = [
  {name:'张三',age:18},
  {name:'李四',age:28},
  {name:'王五',age:13},
  {name:'张三',age:48},
  {name:'陈六',age:48},
];

var newArr = arr.slice(1,3);
console.log('newArr',newArr);

// 数组成员为对象, initValue不能省略
var arr = [
  {name:'张三',age:1},
  {name:'李四',age:1},
  {name:'王五',age:1},
  {name:'张三',age:1},
  {name:'陈六',age:1},
];

var total = arr.reduce(function(sum,item) {
  return sum + item.age;
},0); 
console.log(total);

9. splice() 重点,难点

从数组中添加或删除元素。

var arr = ['a','b','c','d','e'];
// 1. 删除成员:从位置1开始, 删除1个
arr.splice(1,1);
console.log(arr);  //[a,c,d,e]

var arr = ['a','b','c','d','e'];
// 2. 删除成员:从位置1开始, 删除3个
arr.splice(1,3);
console.log(arr);  // [a,e]

var arr = ['a','b','c','d','e'];
// 3.替换
arr.splice(1,2,'z');
console.log(arr);

10. sort()

对数组的元素进行排序。

// 字符串数组排序
var arr = ['ouzhixiang','chenjingyuan','chenpeipeng','tubobin','liuxinsu'];
arr.sort(); // 按字母升序
arr.reverse(); // 降序排序
console.log('排序后的数组',arr);

// 数字数组排序
var arr = [1,3,4,345,7,8,33];
// 升序排列
arr.sort(function(a,b) {
  return a-b;
});
console.log('升序排列',arr);

// 降序排列
arr.sort(function(a,b) {
  return b-a;
});
console.log('降序排列',arr);

// 对象数组排序
var arr = [
  { username: "zhangsan", nickName: "张三", age: 18 },
  { username: "lisi", nickName: "李四", age: 28 },
  { username: "wangwu", nickName: "王五", age: 13 },
  { username: "lisan", nickName: "李三", age: 48 },
  { username: "chenliu", nickName: "陈六", age: 48 },
];

arr.sort(function(a,b) {
  if(a.age > b.age) {
    return 1;
  } else if (a.age<b.age) {
    return -1;
  } else {
    return 0;
  }
})
console.log('排序后的数组',arr);

// 封装函数, 让对象数组可以按任意属性进行排序
var arr = [
  {
    username: "zhangsan",
    nickName: "张三",
    age: 18,
  },
  {
    username: "lisi",
    nickName: "李四",
    age: 28,
  },
  {
    username: "wangwu",
    nickName: "王五",
    age: 13,
  },
  {
    username: "lisan",
    nickName: "李三",
    age: 48,
  },
  {
    username: "chenliu",
    nickName: "陈六",
    age: 48,
  },
];

function compareFn(attr) {
  function sortFn(a, b) {
    if (a[attr] > b[attr]) {
      return 1;
    } else if (a[attr] < b[attr]) {
      return -1;
    } else {
      return 0;
    }
  }
  return sortFn;
}

arr.sort(compareFn("age")); // 按年龄排序
arr.sort(compareFn("username")); // username排序
console.log(arr);

11. reduce()

数组累加器

var arr = [1,2,3,4];

var total = arr.reduce(function(sum,item,index){
  return sum+item;
},0);
console.log(total);

(七) 练习和作业

练习:

封装一个函数, 每运行一次就返回一个某个范围内的随机数(比如5-20);

<!DOCTYPE html>
<html lang="en">

<body> 
	<input type="text" id="inp1"> -
	<input type="text" id="inp2">
	<button onclick="madeNum()">生成随机数</button>
	<p class="num"></p>

	<script>
		// 生成随机数的方法
		function madeNum() {
		 
		}
	</script>
</body> 
</html>

在页面上绑定一个点击事件,用来每天打卡, 用户点击打卡按钮, 若点击时间是每天的8:55(不包含)-9:00(包含), 弹出迟到, 若点击时间是9:00(不包含)之后, 弹出严重迟到
```
<!DOCTYPE html>
<html lang="en">

<body>  
	<button onclick="sign()">打卡</button>
	 
	<script> 
		function sign() {
			 
		}
	</script>
</body> 
</html>
```

将字符串 "13800000000" 变成"138****0000"

<!DOCTYPE html>
<html lang="en"> 
<body>  
	<input type="text" maxlength="11"> <button onclick="sliceStr()">改变</button>
	<p class="tel"></p>
	 <script>
		 function sliceStr() {
			 
		 }
	 </script>
</body> 
</html>

用户输入手机号码后,点击获取验证码, 弹出"验证码已发送到尾号为xxxx(4位)的手机上, 请注意查收"

另:

把用户输入的内容前后去空格
检查用户输入的是否是11位的数字

<!DOCTYPE html>
<html lang="en">
<head> 
	<title>Document</title>
</head>
<body>
	<input placeholder="请输入手机号码"/> <button onclick="checkTel()">获取验证码</button>
 
	<script>
		function checkTel() {
		 
		}
	</script>
</body>
</html>

编写一个Javascipt函数parseQueryString，它的用途是把URL参数解析成为一个对象

比如: {action:home,scene=123,......}

var url =
  "https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MjM5Njk2NTE5Mg&scene=124";
var obj = parseQueryString(url);
console.log('obj',obj);

function parseQueryString(url) {
  
}

(七) 数组作业

1. web115班有56个学生, 补充代码, 把学生信息渲染到页面上, 添加随机选择学生功能, 选中的学生高亮

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    body {
      background-color: #f4f4f4;
    }

    .btn-box {
      text-align: center;
    }

    .box {
      padding: 20px;
      display: flex;
      background-color: #fff;
      width: 600px;
      margin: 0 auto;
      flex-wrap: wrap;
      align-content: flex-start;
      justify-content: space-around;
      min-height: 500px;
    }

    .item {
      border: 1px solid #999;
      width: 120px;
      margin: 5px;
      text-align: center;
    }

    .active {
      color: red;
    }
  </style>
  <script src="https://cdn.bootcdn.net/ajax/libs/Mock.js/1.0.1-beta3/mock-min.js"></script>
</head>

<body>
  <div class="btn-box"> <button onclick="madeData()">生成数据</button> <button onclick="select()">随机选择</button></div>
  <div class="box">
    <span class="item">1.邱用(男)</span>
    <span class="item">2.邱用(男)</span>
    <span class="item">3.邱用(男)</span>
  </div>

  <script>
    var list = [];

    function madeData() {
      
    }

    function select() {
      
    }
  </script>
</body>
</html>

2. 计算购物车总价

有如下两个数组, goodsList[] 是商品列表数组, idList[] 是被选中的商品的id组成的数组, 请计算被选中商品的总价

// 商品数组列表
var goodsList = [
  {
    productId: "94217104",
    buyNum: 1,
    masterName: "【山西】红富士苹果 8-10枚5斤装（果径80mm/枚）",
    slaveName: "生态基地种植 饱满圆润脆甜 皮薄肉厚多汁",
    userId: "60d6f0b08f119d3e25af8cef",
    price: "3480",
    cartId: "61c285c90ab3e6758a54904f",
  },
  {
    productId: "104356809",
    buyNum: 1,
    masterName: "【云南】冰糖心丑苹果",
    slaveName: "原产基地直供 脆甜多汁爽口 自然糖心结晶",
    userId: "60d6f0b08f119d3e25af8cef",
    price: "3990",
    cartId: "61c2edee0ab3e6758a549055",
  },
  {
    productId: "31129853",
    buyNum: 3,
    masterName: "四川安岳黄柠檬 3斤装（单果90-110g）",
    slaveName: "采自“中国柠檬之都” 个头圆润均匀 地道酸爽十足",
    userId: "60d6f0b08f119d3e25af8cef",
    price: "2390",
    cartId: "61c9bfd76a92be12aba9afd1",
  },
  {
    productId: "97305541",
    buyNum: 2,
    masterName: "【四川】新鲜青柠檬 3斤（单果90-110g）",
    slaveName: "果园现摘现发 清新酸爽怡人 个头圆润饱满",
    userId: "60d6f0b08f119d3e25af8cef",
    price: "1990",
    cartId: "61c9bfde6a92be12aba9afd2",
  },
  {
    productId: "88651149",
    buyNum: 2,
    masterName: "【福建】黄金百香果 大果 （单果70-100g）",
    slaveName: "醇香自然圆润 酸甜多汁可口 富含多种维生素",
    userId: "60d6f0b08f119d3e25af8cef",
    price: "5350",
    cartId: "61c9bfe76a92be12aba9afd3",
  },
];

// 被选中的商品id数组
var idList = [
  "61c9bfe76a92be12aba9afd3",
  "61c9bfde6a92be12aba9afd2",
  "61c9bfd76a92be12aba9afd1",
];

// 计算总价

3. 写一个diff方法, 用于比较两个数组, 返回数组中不同的部分

比较两个数组,然后返回一个新数组,该数组的元素为两个给定数组中所有独有的数组元素。换言之, 返回两个数组的差异。

var list1 = [1, 3, 8, 4, 7];
var list2 = [1, 2, 8, 3, 4];
// 最后应该得到的数组是: [7,2]

function diff(arr1, arr2) { 
 
}

4. 数组排序

写一个function, 实现对一个对象数组按任意属性排序, 如对以下数组分别按id和name排序

var list = [
  { id: 0, name: "java" },
  { id: 8, name: "go" },
  { id: 5, name: "python" },
  { id: 10, name: "javascript" },
];

5. 数组去重

对以下数组执行去重操作

var list = [1,2,3,4,5,6,5,3,2,4,56,4,1,2,1,1,1,1,1,1,56,45,56];

var list = [
  1, 2, 3, 4, 5, 6, 5, 3, 2, 4, 56, 4, 1, 2, 1, 1, 1, 1, 1, 1, 56, 45, 56,
];

// 封装成函数
function noRepeat(list) {
  
}

6. 出现次数最多的字符

写一个function, 实现查找一个字符串中出现次数最多的字符

var str = "asdfjlkjgajsfgasdfhaskdfhsakdhfjgsdfasdjf";

function getTheMax(str) {
 
}

7. 查找用户

var users = [
  {
    name: "张三",
    sex: 1, // 男
    age: 18,
    skill: [
      "song", // 唱歌
      "speak", // 说话
      "eat", // 吃饭
    ],
  },
  {
    name: "李四",
    sex: 0, // 女
    age: 23,
    skill: [
      "play", // 玩
      "speak",
      "eat",
    ],
  },
  {
    name: "王五",
    sex: 1,
    age: 34,
    skill: [
      "song",
      "sleep", // 睡觉
      "eat",
    ],
  },
  {
    name: "赵六",
    sex: 0,
    age: 19,
    skill: [
      "song",
      "sleep",
      "dance", // 跳舞
    ],
  },
];

function findUser(users) {
  // todo 请在此处补齐代码, 筛选出同时具有"speak"和"song"技能的用户, 并将他们的名字, 性别, 年龄和技能用中文在控制台打印出来
  // todo e.g. "张三,男,18岁, 会唱歌,说话,吃饭.", 多行数据换行
  // 声明数组list用于存放过滤后的用户
 
}

8. 改造数组

将以下数组成员变成 {label:'xxx', value:'xxxx'} 的形式, 其中label对应数组成员的name属性, value对应数组成员的id属性

var list = [{"name":"梁芳","sex":"女","id":"001"},{"name":"萧艳","sex":"男","id":"002"},{"name":"宋洋","sex":"女","id":"003"},{"name":"卢伟","sex":"男","id":"004"},{"name":"康杰","sex":"男","id":"005"}]

// var newList = [{label: '梁芳', value: '001'}, ....];

第05节函数和作用域

第07节 DOM

第6节 内置函数大纲 #

(一) 构造函数和创建对象 #

1.两种函数 #

2.创建对象的两种方式 #

(二) 日期对象常用方法和插件 #

1. 创建日期的3种方式 #

2. 日期常用方法 #

3. 日期函数应用 #

4. 日期函数库 #

(三) Math 对象 #

(四) 字符串常用方法 #

(1) 基本类型添加属性无效 #

(2) 字符串常用方法 #

(五) 常用的数组方法 #

【金山文档】 《数组常用方法》 #

1. join() #

2. reverse() #

3. 添加设删除数组成员 #

4. 数组检测 #

5. map() #

6. filter() #

7. forEach() #

8. slice() #

9. splice() 重点,难点 #

10. sort() #

11. reduce() #

(七) 练习和作业 #

(七) 数组作业 #

1. web115班有56个学生, 补充代码, 把学生信息渲染到页面上, 添加随机选择学生功能, 选中的学生高亮 #

2. 计算购物车总价 #

3. 写一个diff方法, 用于比较两个数组, 返回数组中不同的部分 #

4. 数组排序 #

5. 数组去重 #

6. 出现次数最多的字符 #

7. 查找用户 #

8. 改造数组 #